import { PlusOutlined } from "@ant-design/icons";
import { PageContainer } from "@ant-design/pro-layout";
import ProTable, { ActionType, ProColumns } from "@ant-design/pro-table";
import Button from "antd/es/button";

import { useRef } from "react";

interface Platform {
    id:string;
    name:string
}

const VideoConfig = () => {
    const platformRef = useRef<ActionType>();
    const columns:ProColumns<Platform>[] = [
        {
            title:'ID',
            dataIndex:'id',
        },
        {
            title:"名称",
            dataIndex:"platform"
        }
    ]
    return <PageContainer>
        <ProTable<Platform,any>
        headerTitle="平台"
        actionRef={platformRef}
        rowKey="id"
        search={{
          labelWidth: 120,
        }}
        toolBarRender={() => [
          <Button
            type="primary"
            key="primary"
            onClick={() => {
            //   handleModalVisible(true);
            }}
          >
            <PlusOutlined /> 添加平台
          </Button>,
        ]}
        // request={rule}
        columns={columns}
        rowSelection={{
          onChange: (_, selectedRows) => {
            // setSelectedRows(selectedRows);
          },
        }}
      />
      <ProTable<Platform,any>
        headerTitle="平台"
        actionRef={platformRef}
        rowKey="id"
        search={{
          labelWidth: 120,
        }}
        toolBarRender={() => [
          <Button
            type="primary"
            key="primary"
            onClick={() => {
            //   handleModalVisible(true);
            }}
          >
            <PlusOutlined /> 添加平台
          </Button>,
        ]}
        // request={rule}
        columns={columns}
        rowSelection={{
          onChange: (_, selectedRows) => {
            // setSelectedRows(selectedRows);
          },
        }}
      />
    </PageContainer>
}

export default VideoConfig;


